import React, { memo } from 'react'
import {
  CoverWrapper
} from './style'
import useShowPlaylistDetail from '@/hooks/useShowPlaylistDetail'
import { formatImg } from '@/utils/format'
export default memo(function Cover(props) {
  const { info, size } = props
  const goToPlaylistDetail = useShowPlaylistDetail()
  return (
    <CoverWrapper>
      <img src={formatImg(info.picUrl,size)} alt="" className="image"/>
      <div className="mask sprite_covor" onClick={e => goToPlaylistDetail(info.id)}></div>
      <div className="name">{info.name}</div>
    </CoverWrapper>
  )
})
